import React from 'react'
import ima from '../assets/images/orange.png'
import '../assets/css/login.css'
import querystring from "querystring";
import { login } from '../request/api'
class Home extends React.Component {
    constructor() {
        super()
        this.state = {
            loginForm: {
                phone: '',
                password: '',
            }
        }
    }
    changeLogin(type, e) {
        this.setState({
            loginForm: {
                ...this.state.loginForm,
                [type]: e.target.value
            }
        })
    }
    login() {
        fetch('/api/login', {
            headers: {
                'Content-Type': "application/x-www-form-urlencoded",
            },
            method: 'post',
            body: querystring.stringify
                (this.state.loginForm),
        })
            .then((res) => res.json())
            .then((res) => {
                if (res.code == 200) {
                    sessionStorage.setItem("isLogin", JSON.stringify(res.list));
                    this.props.history.push('/index/home');
                    alert(res.msg)
                } else {
                    alert(res.msg)
                }
            })
        //有上传文件
        // let data = new FormData()
        // for(let i in  this.state.loginForm){
        //   data.append(i,this.state.loginForm[i])
        // }
        // fetch("/api/login", {
        //   method: "post",
        //   body: data
        // })
        //   .then((res) => res.json())
        //   .then((res) => {
        //     console.log(res,'登录结果');
        //   });
    }

    render() {
        return (<div>
            <div className='denglu_top'>
                <span className="zt1">手机登录</span>
            </div>
            <div className="cvmain">
                <img src={ima} alt="" />
                <p>
                    <span>手机号：</span>
                    <input className='inp'
                        onChange={this.changeLogin.bind(this, 'phone')}
                        type="text" placeholder='请输入手机号' />
                </p>
                <p>
                    <span>密码：</span>
                    <input className='inp1'
                        onChange={this.changeLogin.bind(this, 'password')}
                        type="text" placeholder='请输入密码' />
                </p>

                <button onClick={this.login.bind(this)}>登录</button>
            </div>
        </div>)
    }
}
export default Home